<template>
  <div>
    <button @click="getHead">获取Header组件上的ref</button>
    <Header ref = "head" />
    <hr>
    <Count />
  </div>
</template>

<script>
//引入组件
import Header from "./components/Header"
import Count from "./components/Count"
export default {
  name: "App",
  //注册组件
  components:{
    Header,
    Count,
  },
  methods:{
    getHead(){
      /* 
        如果把ref属性写在一个组件上,那么$refs对象上保存的是组件实例
      */
      console.log(this);
      console.log(this.$refs.head);
    }
  }
}
</script>

<style>

</style>